<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>高度</title>
		<style>
			div{
				height: 500px;
				border: 2px solid red;
				border-radius: 30px;
				margin: 20px;
			}
			#d1{
				width: 300px;
			}
		</style>
		<script>
			function getDiv(){
				var d1=document.getElementById("d1");
				var d2=document.getElementById("d2");
				alert(d1.style.height+"X"+d1.style.width);
				alert(d2.style.height+"X"+d2.style.width);
				var w1=document.defaultView.getComputedStyle(d1,null);
				var w2=document.defaultView.getComputedStyle(d2,null);
				alert(w1.height+"X"+w1.width);
				alert(w2.height+"X"+w2.width); 
				//alert("d2宽度："+d2.currentStyle.height);
			}
		</script>
	</head>
	<body>
		<button type="button" onclick="getDiv()" >获得div大小</button>
		<div id="d1"></div>
		<div id="d2" style="width: 400px;"></div>
	</body>
</html>